
* run raco doc to view documentation 

* racket gui stuff

** terminology

*** area is the fundamental building block for racket graphical applications

*** containers are areas that contain other areas
**** dialog is a modal top-level window.  The dialog must be closed before the other bits of the application can continue

**** a panel is a subcontainer within a container.  Racket has three
***** vertical-panel

***** horizontal-panel

***** tab-panel

**** a pane is a light weight panel.  It has no graphical representation or event-handling capabilities.
***** vertical-pane

***** horizontal-pane

***** grow-box-spacer-pane
*** containees are areas that must be contained within other areas

**** panel is both a containee as well as a container

**** pane is both a containee as well as a container

**** canvas is a subwindow for drawing on the screen 

**** editor canvas is allows one to type on an area on the screen 

*** controls are containees that the user can manipulate

**** message a static text field that the user cannot change

**** button a clickable tool

**** check-box a clickable tool
     
**** radio box

**** choice is a pop up of options that the user selects one item

**** list box is a list of items that the user can select multiple items

**** text-field is a simple box for text entry

**** combo-field combines a text-field with a pop up menu of choices

**** slider lets one manipulate in integer value via a sliding widget

**** gauge is a output only control that reports a value that the user cannot change
*** menus

**** menu containers

***** menu bar is a collection of menus that is usually in a horizontal frame

***** menu is a set of menu items.  This can appear in a menu bar, popup menu, or submenu

***** popup menu this is a top-level menu that is dynamically displayed in a canvas

**** menu items

***** separator-menu-item is an unselcectable line between two menu items

***** menu-item is a selectable text option in a menu.  When selected the callback in invoked

***** menu is a menu item as well as a menu container.
** diagram of areas

#+BEGIN_EXAMPLE
                            area<%>

       ______________________|_______________

       |                  |                 |

  subarea<%>          window<%>      area-container<%>      

       |____       _______|__________       |

            |      |                |       |

           subwindow<%>          area-container-window<%>

        ________|________                |

        |               |                |

     control<%>       canvas<%>   top-level-window<%>



                       area<%>

        _____________________|_______________

        |               |                   |

      subarea<%>     window<%>       area-container<%>      

<<<____|____       _____|__________       __|___  ___________________<<<

            |      |              |       |    |  |                  

           subwindow<%>           |       |    |  |                  

<<<______________|___________     |       |    |  |                 _<<<

            |               |     |       |    pane%                |

       control<%>           |     |       |     |- horizontal-pane% |

        |- message%         |     |       |     |- vertical-pane%   |

        |- button%          |     |       |                         |

        |- check-box%       |  area-container-window<%>             |

        |- slider%          |        |                              |

        |- gauge%           |        |            __________________|

        |- text-field%      |        |            |   

            |- combo-field% |        |-------- panel%       

        |- radio-box%       |        |          |- horizontal-panel%

        |- list-control<%>  |        |          |- vertical-panel%

            |- choice%      |        |              |- tab-panel%

            |- list-box%    |        |              |- group-box-panel%

                            |        |

                            |        |- top-level-window<%>

                            |            |- frame% 

                         canvas<%>       |- dialog%

                          |- canvas%

                          |- editor-canvas%

#+END_EXAMPLE

** diagram of menus

#+BEGIN_EXAMPLE
     menu-item<%>                menu-item-container<%> 

        |                              | 

        |- separator-menu-item%   _____|___ 

        |- labelled-menu-item<%>  |       |- menu-bar% 

            _________|_________   |       |- popup-menu% 

            |                 |   | 

            |                 menu%

            |                          

            |- selectable-menu-item<%>               

                |- menu-item%                        

                |- checkable-menu-item%

#+END_EXAMPLE

** Geometry management of elements 

   Containers support vertical and horizontal stacking, which can be
   nested.  With this support, most anything is doable.

   |   | an element |                 |     |
   |   |            | another element |     |
   |   |            |                 |     |
   |   |            |                 | etc |
   |   |            |                 |     |
*** containees

    These are like sub-containers or children.  They each have these
    properties:

    - an immutable (unchangable) graphical minimum and vertical minimum, which is calculated at
      creation time.  
    - a requested graphical minimum and vertical minimum.  If your
      requested graphical minimum size is larger than the graphical
      minimum size, then at creation time, the requested minimum size
      is used.
    - a horizontal and vertical stretchability on or off.  If it is
      off, the containee always shrinks to it's minimum size
    - horizontal and vertical margins

    A container arranges its children based on the four properties of
    all of its containees.  When you create the containee, you specify
    its parent container.  A window container can be hidden/deleted
    within its parent, and it's parent can be changed by reparenting!
*** containers have the following properties

    - a list of (non-deleted) children containees
    - a requested minimum width and requested minimum height
    - spacing used between the children
    - a border margin used around all of the children
    - horizontal and vertical stretchability (on or off)
    - an alignment setting for leftover space


* racket gui easy stuff

  https://docs.racket-lang.org/gui-easy/index.html
